<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>主页</title>
    <link rel="stylesheet" href="https://unpkg.com/swiper/swiper-bundle.min.css"> 
    
</head>
<body class="dpflex dec">

    <div class="home-header flex1 ">
        <div class="carousel">
            <!-- 轮播图 -->
            <div class="swiper-container">
                <div class="swiper-wrapper">
                    <div class="swiper-slide">
                        <img src="./img/index-swiper-bg1.jpg" alt="">
                    </div>
                    <div class="swiper-slide">
                        <img src="./img/index-swiper-bg2.jpg" alt="">
                    </div>
                    <div class="swiper-slide">
                        <img src="./img/index-swiper-bg3.jpg" alt="">
                    </div>
                </div>
                <!-- 如果需要分页器 -->
                <div class="swiper-pagination"></div>
            </div>
        </div>
        
        <div class="hm-main flex1">
            <!-- 排名-打卡 -->
            <div class="rank-clock dpflex">
                 <!-- 排名 -->
                <div class="today-rank mr20 home-main">
                    <p class="text fs20 wathet">今日排名</p>
                    <span class="panchnum clfff" id="rankTody">1</span>
                </div>
                <!-- 打卡 -->
                <div class="clock-in  home-main" >
                    <p class="text fs20 wathet">累计打卡
                        <span id="clocksDay"></span>天
                    </p>
                    <span class="panchnum" id="todyClock"></span>
                </div>
            </div>
            <!-- 数据-徽章 -->
            <div class="datum-emblem dpflex">
                <!-- 数据 -->
                <div class="datum  mr20 home-main" >
                    <p class="text fs16 clfff">运动数据</p>
                </div>
                <!-- 徽章 -->
                <div class="emblem home-main" >
                    <p class="text fs16 wathet">累计运动徽章</p>
                    <span class="panchnum wathet" id="badgenum"></span>
                </div>
            </div>
            
            <!-- 课程训练 -->
            <div class="training home-main">
                <p class="text fs16 clfff">课程训练</p>
            </div>
            <!-- 户外跑步 -->
            <div class="run home-main  mb20">
                <p class="text fs16 clfff">户外跑步</p>
            </div>
           
    
        </div>

    </div>

    <!-- 页脚 -->
    <div class="footer">
        
    </div>
    <!-- <div class="menubar  ">
        <a>
            <span class="iconfont icon-shouye"></span>
            <p>首页</p>
        </a>
        <a>
            <span class="iconfont icon-wode-yundongcopy"></span>
            <p>运动</p> 
        </a>
        <a>
            <span class="iconfont icon-wode"></span>
            <p>我的</p> 
        </a>
    </div> -->

    <script src="https://unpkg.com/swiper/swiper-bundle.min.js"> </script>
    <script src="https://cdn.bootcdn.net/ajax/libs/axios/0.21.1/axios.min.js"></script>

</body>
</html>